<template>
  <div>
    <div>
      <el-breadcrumb separator-class="el-icon-arrow-right">
        <el-breadcrumb-item :to="{ path: '/index' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item>系统中心</el-breadcrumb-item>
        <el-breadcrumb-item>工序管理</el-breadcrumb-item>
        <el-breadcrumb-item>工序详情</el-breadcrumb-item>
      </el-breadcrumb>
      <el-card class="box-card">
        <div slot="header" class="clearfix">
          <span>工序详情</span>
          <el-button style="float: right; padding: 3px 0" icon="el-icon-close" circle @click="back"></el-button>
        </div>
        <el-form :model="process" :rules="processRules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
          <el-row :gutter="20">
            <el-col :span="10">
              <el-form-item label="工序编号" prop="code">
                <el-input v-model="process.code" disabled></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="10">
              <el-form-item label="工序名称" prop="name">
                <el-input v-model="process.name" disabled></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="10">
              <el-form-item label="收费方式" prop="ctype">
                <template>
                  <el-select v-model="process.ctype" placeholder="请选择收费方式" disabled>
                    <el-option
                      key="0"
                      label="按时收费"
                      :value="0">
                    </el-option>
                    <el-option
                      key="0"
                      label="按件收费"
                      :value="1">
                    </el-option>
                  </el-select>
                </template>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="10">
              <el-form-item label="单价" prop="price">
                <el-input v-model="process.price" disabled></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="10">
              <el-form-item label="准备工时单价" prop="prePrice">
                <el-input v-model="process.prePrice" disabled></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="20">
              <el-form-item label="描述" prop="remarks" >
                <div style="margin: 20px 0;"></div>
                <el-input
                  type="textarea"
                  placeholder="请输入内容"
                  v-model="process.remarks"
                  maxlength="30"
                  show-word-limit
                  disabled
                  >
                </el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-card>
    </div>
  </div>
</template>

<script>
  export default {
    name: 'LookProcess',
    data(){
      return{
        process:{
          id:'',
          name:'',
          code:'',
          ctype:'',
          price:'',
          prePrice:'',
          remarks:'',
        },
      }
    },
    methods:{
      back:function () {
        this.$router.push('/processList')
      },
      lookProcess:function (id) {
        this.$http.get('/process/get/'+id).then((res)=>{
          this.process=res.data.result
        })
      }
    },
    mounted () {
      var id =this.$route.query.id;
      this.lookProcess(id);
      alert(id)
    }

  }
</script>

<style scoped>

</style>
